 <template>
 	<el-dialog title="" visible :show-close="false"  append-to-body :modal-append-to-body="false" class="wrap" width="70%">
 		<div class="bt">人事详情</div>
		<i class="el-icon-close close" @click="cancel" style="color: white;z-index:10;"></i>
 		<el-form label-width="100px" class="form">
 			<el-tabs v-model="activeName"  style="text-align: center;">
 				<!--@tab-click="handleClick"-->
		    <el-tab-pane label="基本信息"  name="first" style="width: 100%;">
		    	<table style="margin: 0 auto;width: 100%;">
		    		<tr>
		    			<td>
		    			<el-form-item label="中文名称">
 				<el-input v-model="form.zwm"  :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    			<td>
		    				<el-form-item label="英文名称">
 				<el-input v-model="form.ywm"  :readonly='true' class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>
		    		<tr>
		    		<td>
 			<el-form-item label="注册时间" class="select-block">
				<el-date-picker  v-model="form.zcsj" :readonly='true' class="select-block"  type="date" placeholder="请选择出生日期"></el-date-picker>
 			</el-form-item>
		    			</td>
		    			<td>
		    				<el-form-item label="老师电话">
 				<el-input v-model="form.dh" :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>
		    		
		    		<tr>
		    			<td>
		    				<el-form-item label="未结算课时">
 				<el-input v-model="form.wjsks" :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    
		    			<td>
		    				<el-form-item label="未结算时长">
 				<el-input v-model="form.wjssc" :readonly='true'   class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>
		    		
		    		<tr>
		    			<td>
		    				<el-form-item label="主教次数">
 				<el-input v-model="form.zjcs1" :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    
		    			<td>
		    				<el-form-item label="助教次数">
 				<el-input v-model="form.zjcs2"  :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>
		    		
		    		<tr>
		    			<td>
		    				<el-form-item label="补课次数">
 				<el-input v-model="form.bkcs" :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    
		    			<td>
		    				<el-form-item label="预计课时次数">
 				<el-input v-model="form.yjkscs" :readonly='true'   class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>

		    		<tr>
		    
		    			<td>
		    				<el-form-item label="班级数">
 				<el-input v-model="form.bjs"  :readonly='true'  class="select-block"></el-input>
 			</el-form-item>
		    			</td>
		    		</tr>


		    	</table>

			    </el-tab-pane>

			    <el-tab-pane label="班级列表" name="second">
			      <el-table :data="kqdataList" :cell-style="styletest" stripe style="width: 100%">
					<el-table-column prop="bjmc" label="班级名称"></el-table-column>

					<el-table-column prop="xzlsmc" label="行政老师"></el-table-column>

					<el-table-column prop="xsrs" label="学生人数"></el-table-column>

					<el-table-column prop="ifqymc" label="班级状态"></el-table-column>

					<el-table-column prop="syks" label="剩余课时"></el-table-column>
					<el-table-column prop="kcmc" label="课程名称"></el-table-column>
					
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange1" @current-change="handleCurrentChange1" :current-page.sync="pageindex1" :page-sizes="pagesizes1" :page-size="pagesize1" :layout="layout" :total="total1" class="class-page">
						</el-pagination>
			    </el-tab-pane>

			    <el-tab-pane label="老师评价" name="third">
			      <el-table :data="kscjdataList" stripe style="width: 100%">
					<el-table-column prop="pjrmc" label="评价人名称"></el-table-column>
					<el-table-column prop="xs" label="评价星数"></el-table-column>
					<el-table-column prop="ms" label="评价描述"></el-table-column>
					<el-table-column prop="pjsj" label="评价时间"></el-table-column>
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange2" @current-change="handleCurrentChange2" :current-page.sync="pageindex2" :page-sizes="pagesizes2" :page-size="pagesize2" :layout="layout" :total="total2" class="class-page">
						</el-pagination>
			    </el-tab-pane>


			    <el-tab-pane label="老师考勤" name="fourth">
			      <el-table :data="lskqdataList" stripe style="width: 100%">
					<el-table-column prop="zwm" label="老师名称"></el-table-column>
					<el-table-column prop="kqlx" label="考勤类型"></el-table-column>
					<el-table-column prop="bjmc" label="班级名称"></el-table-column>
					<el-table-column prop="sj" label="考勤时间"></el-table-column>
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange3" @current-change="handleCurrentChange3" :current-page.sync="pageindex3" :page-sizes="pagesizes3" :page-size="pagesize3" :layout="layout" :total="total3" class="class-page">
						</el-pagination>
			    </el-tab-pane>


			    <el-tab-pane label="老师结算记录" name="fiveth">
			      <el-table :data="xspjdataList" stripe style="width: 100%">
					<el-table-column prop="jxks" label="结算课时"></el-table-column>
					<el-table-column prop="jxje" label="结算金额"></el-table-column>
					<el-table-column prop="jssj" label="结算时间"></el-table-column>
					<el-table-column prop="jslx" label="结算类型"></el-table-column>
					<el-table-column prop="jsrmc" label="结算人名称"></el-table-column>
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange4" @current-change="handleCurrentChange4" :current-page.sync="pageindex4" :page-sizes="pagesizes4" :page-size="pagesize4" :layout="layout" :total="total4" class="class-page">
						</el-pagination>
			    </el-tab-pane>



			    <el-tab-pane label="老师补课" name="sixth">
			      <el-table :data="xwcjdataList" stripe style="width: 100%">
					<el-table-column prop="zwm" label="补课学生"></el-table-column>
					<el-table-column prop="bksj" label="补课时间"></el-table-column>
					<el-table-column prop="zt" label="补课状态"></el-table-column>
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange5" @current-change="handleCurrentChange5" :current-page.sync="pageindex5" :page-sizes="pagesizes5" :page-size="pagesize5" :layout="layout" :total="total5" class="class-page">
						</el-pagination>
			    </el-tab-pane>
			    
			    <el-tab-pane label="老师课表" name="seventh">
			      <el-table :data="lskbdataList" stripe style="width: 100%">
					<el-table-column prop="sksj" label="上课时间"></el-table-column>
					<el-table-column prop="bjmc" label="班级名称"></el-table-column>
					<el-table-column prop="skls" label="上课老师"></el-table-column>
					<el-table-column prop="jsmc" label="教室名称"></el-table-column>
					<el-table-column prop="xq" label="星期几"></el-table-column>
					<el-table-column prop="xh" label="Day"></el-table-column>
				  </el-table>
				  <!-- 分页查询区域 -->
						<el-pagination @size-change="handleSizeChange6" @current-change="handleCurrentChange6" :current-page.sync="pageindex6" :page-sizes="pagesizes6" :page-size="pagesize6" :layout="layout" :total="total6" class="class-page">
						</el-pagination>
			    </el-tab-pane>
            </el-tabs>
            
 		<el-button type="danger" class="submit" @click="cancel">退出</el-button>
            
 		</el-form>

 	</el-dialog>
 </template>
 <script type="text/javascript">
 	import qs from 'qs'
 	export default {
 		components: { },
 		props: ['params'],
 		data() {
 			return {
 				 activeName: 'first',
 				form: {
 					bjs:'',
 					zcsj:'',
					 dh :'',
					 mm :'',
					 tx :'',
					 xb :'',
					 zwm :'',
					 ywm :'',
					 lsid :'',
					 bjid :'',
					 isty :'',
					 yjkscs:'',
					 iszf :'',
					 issj :'',
					 isqymc:'',
					 lx :'',
					 csrq :'',
					 zsly :'',
					 fmdh :'',
					 wx :'',
					 jtdz :'',
					 glxx :'',
					 njbj :'',
					 bj :'',
					 xh :'',
					 yuer :'',
					 lstype:'',
 					 id:''
 				},
 				kqdataList: [],
   				lskqdataList:[],
 				xspjdataList:[],
 				kscjdataList:[],
 				xwcjdataList: [],
 				lskbdataList:[],
// 				jbxxdataList:[],
 				
   				/*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex1: 1,//当前分页页码
                pagesizes1: [8],//显示个数的选择器选项
                pagesize1: 8,//每页显示条目数
                total1: 0,//总条数

                /*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex2: 1,//当前分页页码
                pagesizes2: [8],//显示个数的选择器选项
                pagesize2: 8,//每页显示条目数
                total2: 0,//总条数

                /*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex3: 1,//当前分页页码
                pagesizes3: [8],//显示个数的选择器选项
                pagesize3: 8,//每页显示条目数
                total3: 0,//总条数

                /*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex4: 1,//当前分页页码
                pagesizes4: [8],//显示个数的选择器选项
                pagesize4: 8,//每页显示条目数
                total4: 0,//总条数

                /*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex5: 1,//当前分页页码
                pagesizes5: [8],//显示个数的选择器选项
                pagesize5: 8,//每页显示条目数
                total5: 0,//总条数
                
                /*分页属性设置*/
                layout: 'total, sizes, prev, pager, next, jumper',//组件布局
                pageindex6: 1,//当前分页页码
                pagesizes6: [8],//显示个数的选择器选项
                pagesize6: 8,//每页显示条目数
                total6: 0,//总条数
 				portComponents: {

                },
 			}
 		},
 		created() {
//		     this.form.id = this.params.row.id;
		     if(this.params.row.lsid){
  		 	 this.form.id=this.params.row.lsid;
  		 }else{
  		     this.form.id = this.params.row.id;
  		 }
//        this.loadinfo();
          this.kq();
          this.xwcj();
          this.kscj();
          this.lskq();
          this.xspj();
          this.lskb();
          this.jbxx();
 		},
 		methods: {
 			styletest(boj){
               console.log(boj,'23')
            if(this.kqdataList[boj.rowIndex].ifqymc == '历史班级'){
              return ' background:#DBD6D6'
            }
    				return '';
    			},
 			 jbxx() {
            var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
             	      ptype:'lsxq',
             	      lsid:this.form.id,
             	      pageindex:'1',
                      pagesize: '1',
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
                console.log('111111111111111111',res)
					let data = res.data.data;        //基本信息
						let list = data.list;
						this.form = list[0]
//					this.total1 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
 			
       //考勤
          kq() {
            var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
             	      ptype:'bjlb',
             	      lsid:this.form.id,
             	      pageindex: this.pageindex1,
                      pagesize: this.pagesize1,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
                console.log('1',res)
					let data = res.data.data;         //班级列表
						let list = data.list;
						this.kqdataList = list;
					this.total1 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange1(val) { //每页显示条数触发事件
				this.pagesize1 = val;
				this.pageindex1 = 1;
				this.kq();
			},
			handleCurrentChange1(val) { //分页触发事件
				this.kq();
			},
			 //考试成绩
          kscj() {
          	 var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
                       ptype:'xspj' ,
             	      lsid:this.form.id,
             	      pageindex: this.pageindex2,
                      pagesize: this.pagesize2,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
                console.log('2',res)
					let data = res.data.data;    //老师评价
					let list = data.list;
					this.kscjdataList = list;
					this.total2 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange2(val) { //每页显示条数触发事件
				this.pagesize2 = val;
				this.pageindex2 = 1;
				this.kscj();
			},
			handleCurrentChange2(val) { //分页触发事件
				this.kscj();
			},
			lskq() {
			 	var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
                       ptype:'lskq',
             	      lsid:this.form.id,
             	      pageindex: this.pageindex1,
                      pagesize: this.pagesize1,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
					console.log(res)
					let data = res.data.data;    //老师课消
						let list = data.list;
						this.lskqdataList = list;
					this.total3 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange3(val) { //每页显示条数触发事件
				this.pagesize3 = val;
				this.pageindex3 = 1;
				this.zyfs();
			},
			handleCurrentChange3(val) { //分页触发事件
				this.zyfs();
			},
			 xspj() {
			 	var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
                    ptype:'lsjs',
             	      lsid:this.form.id,
             	      pageindex: this.pageindex4,
                      pagesize: this.pagesize4,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
               console.log('3',res)
					let data = res.data.data;      //结算记录
						let list = data.list;
						this.xspjdataList = list;
					this.total4 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange4(val) { //每页显示条数触发事件
				this.pagesize4 = val;
				this.pageindex4 = 1;
				this.xspj();
			},
			handleCurrentChange4(val) { //分页触发事件
				this.xspj();
			},
			xwcj() {
				var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
                      ptype:'lsbk',
             	      lsid:this.form.id,
             	      pageindex: this.pageindex5,
                      pagesize: this.pagesize5,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
					console.log('4',res)
					let data = res.data.data;         //老师补课
						let list = data.list;
						this.xwcjdataList = list;
					this.total5 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange5(val) { //每页显示条数触发事件
				this.pagesize5 = val;
				this.pageindex5 = 1;
				this.xwcj();
			},
			handleCurrentChange5(val) { //分页触发事件
				this.xwcj();
			},
			lskb() {
				var logininfo = JSON.parse(localStorage.logininfo);
              this.searchLoading = true;
             var params2 = qs.stringify({
                      ptype:'lskb',
             	      lsid:this.form.id,
             	      pageindex: this.pageindex6,
                      pagesize: this.pagesize6,
                      xxid:logininfo.xxid,
				      yhid:logininfo.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'ls/xiangqing',  params2 )
                 .then(res => {
					console.log('5',res)
					let data = res.data.data;         //老师补课
						let list = data.list;
						this.lskbdataList = list;
					this.total6 = data.totalPage;
					this.searchLoading = false;
                 }).catch(res => {
					 console.log(res)
                  this.searchLoading = false;
				})	
			},
			handleSizeChange6(val) { //每页显示条数触发事件
				this.pagesize6 = val;
				this.pageindex6 = 1;
				this.lskb();
			},
			handleCurrentChange6(val) { //分页触发事件
				this.lskb();
			},
// 			loadinfo(){
//				var logininfo = JSON.parse(localStorage.logininfo);
//           var params2 = qs.stringify({
//                xxid:logininfo.xxid,
//							 yhid:logininfo.id,
//							 id:this.form.id
//             })
//           //执行
//               this.axios.post(this.$store.state.api + 'ls/info',  params2 )
//               .then(res => {
//               this.form=res.data.data
//               }).catch(res => {
//					this.$message.warning("服务器异常");
// 			 				this.$emit('close', { type: 'info', cancel: true });
//				})
//			},
 			cancel() {
 				this.$emit('close', { type: 'lsxq', cancel: true })
 			},
 			componentsShow (type,data) { //显示组件
                console.log(type,data)
                for ( let i in this.portComponents ) {
                    if (type == this.portComponents[i].type) {
                        this.portComponents[i].toggle = true;
                        this.portComponents[i].params = data;
                        if (this.portComponents[i].data.type == 'single') {
                            this.portComponents[i].data.index = data.row.id
                        }else if(this.portComponents[i].data.type == 'multiple'){
                            this.portComponents[i].data.index = this.multipleDelNum;
                        }else{
                            return;
                        }
                        return;
                    }
                }
            },
 			componentsHide (setting) { //关闭组件
   				this.portComponents.xwcjadd.toggle=false;
   				this.portComponents.xwcjedit.toggle=false;
                for ( let i in this.portComponents ) {
                    if (setting.type == this.portComponents[i].type) {
                       this.portComponents[i].toggle = false;
                       if (this.portComponents[i].type=='bq'){
                       	  if (!setting.cancel) {
                       	     for ( let b in setting.clist ) {

                        	 this.bqList.push( setting.clist[b]);
                          }

                       	  }
                       }else{
                        if (!setting.cancel) {
                        }
                       }
                       return;
                    }
                }
            }
 		}
 	}
 </script>
 <style lang="less" scoped>
 	.wrap {
 		text-align: center;
 	}
 	.form {
 		text-align: left;
 		margin-top: 20px;
 	}
 	.bt{
		 position: absolute;
     width: 100%;
     height: 50px;
     margin: 0 auto;
     top: 0;
     left: 0;
     background: #50BFFF;
     color:white;
     text-align:left;
     line-height: 50px;
     font-size: 17px;
     padding-left: 15px;
		}
 	.input {
             display: inline-block;
         }
 	.select-block {
 		width: 100%;
 		display: block;
 	}
 	.submit {
 		width: 120px;
 		margin-left: 40%;
 	}
 	.header{
 		width: 100%;
 		height: 30px;
 		margin: 0 auto;
 	}
 	.one{
 		width: 25%;
 		height: 30px;
 		float: left;
 		text-align: center;
 		line-height: 30px;
 	}
 	.left{
 		width: 50%;
 		height: 100%;
 		float: left;
 	}
 	.right{
 		width: 50%;
 		height: 100%;
 		float: right;
 	}
 	.el-form-item {
    margin-bottom: 5px;
}
.el-button+.el-button {
    margin-left: 1px;
}
 </style>
